$(function(){
    /*
        1 点击搜索
            1 获取输入框的值
            2 检查合法性
                1 非空 空 length == 0 return
                2 合法
            3 把数据存入到本地存储中
                1 存入的是 数组字符串
                2 本地存储 存入的复杂类型 对象 obj 数组 arr
                数据丢失
                存复杂数据 先转成json字符串 再存入
                获取 先获取-->再解析成对象
    */
   var ls = localStorage;
   init();
   function init() {
       eventList();
       load_data();
   }

   // 绑定一坨事件
   function eventList() {
       $("#search_btn").on("tap",function(){
           // 1 获取输入值 trim 去除输入框两边的空格
           var search_txt = $("#search_inp").val().trim();
           // 2 检查合法性
           if(!search_txt) {
               // 给用户提示 mui 消息框
               mui.toast("输入非法");
               return;
           }
           // 3 存入数据
           var arr = ls.getItem("lt_history")?JSON.parse(ls.getItem("lt_history")):[];
           // 数据去重
           arr.forEach(function (v,i) {
                // console.log(v,i);
                if(v == search_txt) {
                    // 删除数组中的这个值
                    // splice(从哪里删除,删除几个)
                    arr.splice(i,1);
                }
           });
           // push 在数组的最后面插入
           // unshift 在数组的头部插入
           arr.unshift(search_txt);
           // 转类型 json
           var arrJson = JSON.stringify(arr);
           ls.setItem("lt_history",arrJson);
           // 跳转页面
           location.href = "./searchList.html?proName=" + search_txt;
       })

       // 清空按钮
       $(".clear_btn").on("tap",function () {
           ls.removeItem("lt_history");
       })

       // 委托
       $(".history_content").on("tap",".remove_btn",function () {
            // 要删除的元素的索引
            var index = $(this).data("index");
            // 获取本地数据 数组
           var arr = ls.getItem("lt_history") ? JSON.parse(ls.getItem("lt_history")):[];
           // 删除一个元素
           arr.splice(index,1);
           // 重新保存
           ls.setItem("lt_history",JSON.stringify(arr));
           // 重新渲染
           load_data();
       })
   }
   // 加载本地数据
   function load_data() {
       // arr 正常的数组 或者 空数组[]
       var arr = ls.getItem("lt_history") ? JSON.parse(ls.getItem("lt_history")) : [];
       // 渲染数据
       if(arr.length == 0) {
           // 当长度为0的时候 直接渲染成空!!!
           $(".history_content").html("");
           return;
       }
       var html = template("mainTpl",{arr:arr});
       $(".history_content").html(html);
   }
})